cssimage: Scale images to contain, not cover
authorBenjamin Otte <otte@redhat.com>
Fri, 13 Jan 2017 02:28:34 +0000 (03:28 +0100)
committerBenjamin Otte <otte@redhat.com>
Fri, 13 Jan 2017 02:38:36 +0000 (03:38 +0100)
Images with just an aspect ratio, but without a size, should be scaled
to be fully visible in the given area.
But we scaled them to completely cover the given area, which made them
partially invisible.

Reftest included.

gtk/gtkcssimage.c
testsuite/reftests/Makefile.am
testsuite/reftests/css-image-aspect-ratio.css [new file with mode: 0644]
testsuite/reftests/css-image-aspect-ratio.ref.ui [new file with mode: 0644]
testsuite/reftests/css-image-aspect-ratio.ui [new file with mode: 0644]

index 29d9959d8bd5a2cd777163a1d18320c86107395b..822ba4726fc97672415ed077679e39448f69b601 100644 (file)
@@ -358,13 +358,13 @@ _gtk_css_image_get_concrete_size (GtkCssImage *image,
         {
           if (image_aspect * default_height > default_width)
             {
-              *concrete_width = default_height * image_aspect;
-              *concrete_height = default_height;
+              *concrete_width = default_width;
+              *concrete_height = default_width / image_aspect;
             }
           else
             {
-              *concrete_width = default_width;
-              *concrete_height = default_width / image_aspect;
+              *concrete_width = default_height * image_aspect;
+              *concrete_height = default_height;
             }
         }
       else
index 2dbca1209cb4f1c98dde6463d63cdcdca704fbf5..31645d23f03791e266ee6d78bd88488d31b3a306 100644 (file)
@@ -198,6 +198,9 @@ testdata = \
        css-currentcolor-alpha.css \
        css-currentcolor-alpha.ui \
        css-currentcolor-alpha.ref.ui \
+       css-image-aspect-ratio.css \
+       css-image-aspect-ratio.ui \
+       css-image-aspect-ratio.ref.ui \
        css-match-class.css \
        css-match-class.ref.ui \
        css-match-class.ui \
diff --git a/testsuite/reftests/css-image-aspect-ratio.css b/testsuite/reftests/css-image-aspect-ratio.css
new file mode 100644 (file)
index 0000000..da054da
--- /dev/null
@@ -0,0 +1,8 @@
+window {
+  background-image: -gtk-icontheme("edit-delete");
+  background-repeat: no-repeat;
+}
+
+#reference {
+  background-size: 24px 24px;
+}
diff --git a/testsuite/reftests/css-image-aspect-ratio.ref.ui b/testsuite/reftests/css-image-aspect-ratio.ref.ui
new file mode 100644 (file)
index 0000000..88fbd72
--- /dev/null
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<interface>
+  <!-- interface-requires gtk+ 3.0 -->
+  <object class="GtkWindow" id="window1">
+    <property name="width_request">48</property>
+    <property name="height_request">24</property>
+    <property name="can_focus">False</property>
+    <property name="type">popup</property>
+    <property name="name">reference</property>
+  </object>
+</interface>
diff --git a/testsuite/reftests/css-image-aspect-ratio.ui b/testsuite/reftests/css-image-aspect-ratio.ui
new file mode 100644 (file)
index 0000000..c7f5598
--- /dev/null
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<interface>
+  <!-- interface-requires gtk+ 3.0 -->
+  <object class="GtkWindow" id="window1">
+    <property name="width_request">48</property>
+    <property name="height_request">24</property>
+    <property name="can_focus">False</property>
+    <property name="type">popup</property>
+  </object>
+</interface>